import React, { Component } from 'react'
import { NavBar, Icon, Toast } from 'antd-mobile';
import GoBack from '../../components/GoBack';
import './Detail.less'
import { reqAddShop, reqDetailInfo } from '../../http/api';
import Header from '../../components/Header';
import Deinfo from './DeInfo/Deinfo';
export default class Detail extends Component {
    constructor() {
        super()
        this.state = {
            //初始化数据
            info: {}
        }
    }

    // 一进页面就发请求
    async componentDidMount() {
        // 取出id
        console.log(this.props);
        let {
            match: {
                params: { id },
            },
        } = this.props;
        console.log(id);
        let res = await reqDetailInfo({ id: id });
        if (res.data.code === 200) {
            // 赋值
            this.setState({
                info: res.data.list[0]
            })
        }
    }
    toShop() {
        //   发请求
        reqAddShop({
           uid:JSON.parse(sessionStorage.getItem('user')).uid,
           type:1,
           goodsid:this.props.match.params.id,
           num:1,

        }).then(res=>{
            if(res.data.code === 200){
                // 弹成功
                Toast.success(res.data.msg, 1);
            }
        })
    }


    render() {
        let { info } = this.state
        return (
            <div className="detail">
                {/* 头部组件 */}
                <Header title="商品详情" back></Header>
                <Deinfo info={info}></Deinfo>
                <footer className="footer">
                    <div className="goShop" onClick={()=>this.props.history.push('/index/shop')}>去购物车</div>
                    <div className="plus" onClick={() => this.toShop()}>加入购物车</div>
                </footer>
            </div>
        )
    }
}
